<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>{:lang('管理员列表')}</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="__PUBLIC__/layui/css/layui.css"  media="all">
    <link rel="stylesheet" href="__PUBLIC__/font-awesome/css/font-awesome.min.css" media="all" />
    <link rel="stylesheet" href="__CSS__/admin.css"  media="all">
    <!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 -->
    <style type="text/css">

        /* tooltip */
        #tooltip{
            position:absolute;
            border:1px solid #ccc;
            background:#333;
            padding:2px;
            display:none;
            color:#fff;
        }
    </style>
</head>
<body>
<div class="layui-fluid">
    <fieldset class="layui-elem-field site-demo-button" style="margin-top: 30px;border:0">
    <form class="layui-form serch" action="{:url('admin/supplier/index')}" method="post">
        <div class="layui-form-item" style="float: left;">
            <div class="layui-input-inline">
                <input placeholder="{:lang('账号')}/{:lang('名称')}" type="text" name="keywords" value="{if isset($wherelist['keywords'])}{$wherelist['keywords']}{/if}" lay-verify="title" autocomplete="off" class="layui-input layui-btn-sm">
            </div>
            <div class="layui-input-inline">
                <select name="company_id" id="company_id" lay-search="" class="layui-select">
                    <option value="">{:lang('供应商')}</option>
                    {volist name='supplierList' id='value'}
                    <option value="{$value.id}" {notempty name="$wherelist.company_id"}{if $wherelist.company_id==$value.id}selected{/if}{/notempty}>{$value.name|default='unknown'}</option>
                    {/volist}
                </select>
            </div>
            <button class="layui-btn layui-btn-danger layui-btn-sm" lay-submit="" lay-filter="search">{:lang('提交')}</button>
            <!--<a href="{:url('admin/supplier/create')}" class="layui-btn layui-btn-sm createSupplier">-->
                <!--{:Lang('添加管理员')}-->
            <!--</a>-->
        </div>
    </form>
</fieldset>
    <table class="layui-table" lay-even="" lay-skin="row" lay-size="sm">
    <thead>
    <tr>
        <th>ID</th>
        <th>{:lang('头像')}</th>
        <th>{:lang('账号')}</th>
        <th>{:lang('名称')}</th>
        <th>{:lang('状态')}</th>
        <th>{:lang('创建时间')}</th>
        <th>{:lang('最后登录时间')}</th>
        <th>{:lang('最后登录IP')}</th>
        <th>{:lang('操作')}</th>
    </tr>
    </thead>
    <tbody>
    {volist name="list" id="vo"}
    <tr>
        <td>{$vo.supplier_admin_id}</td>
        <td>
            <img class="admin_thumb" src="{$vo.thumb|geturl}" width="50">
        </td>
        <td>{$vo.supplier_account}</td>
        <td>{$vo.supplier_name}</td>
        <td>
            <form class="layui-form" action="">
                <div class="layui-input-inline">
                    <div class="layui-inline">
                        <input type="checkbox" name="is_use" value="1" data-id="{$vo.supplier_admin_id}" lay-filter="changeUse" lay-skin="switch" lay-text="{:lang('启用')}|{:lang('禁用')}" {if $vo.is_use==1}checked{/if}>
                    </div>
                </div>
            </form>
        </td>
        <td>{$vo.create_time|date="Y-m-d H:i",###}</td>
        <td>{$vo.login_time|date="Y-m-d H:i",###}</td>
        <td>{$vo.login_ip}</td>
        <td class="operation-menu">
            <a data-content='{$vo.company_info|json_encode=###,JSON_UNESCAPED_UNICODE}' class="layui-btn layui-btn-xs details" style="margin-right: 0;font-size:12px;">{:lang('查看')}</a>
        </td>
    </tr>
    {/volist}
    </tbody>
</table>
</div>
<script src="__PUBLIC__/layui/layui.js" charset="utf-8"></script>
<script src="__PUBLIC__/jquery/jquery.min.js"></script>
<script>
    var message;
    layui.config({
        base: '__JS__/',
        version: '1.0.1'
    }).use(['app', 'message','form'], function() {
        var app = layui.app,
            $ = layui.jquery,
            form = layui.form,
            layer = layui.layer;
        //将message设置为全局以便子页面调用
        message = layui.message;
        //主入口
        app.set({
            type: 'iframe'
        }).init();

        //搜索提交
        form.on('submit(search)',function(){

        })
        //修改禁用状态
        form.on('switch(changeUse)',function (data) {
            var id = $(this).attr('data-id');
            var is_use = 0;
            if(data.elem.checked){
                is_use = 1;
            }
            $.post('{:url("admin/supplier/edit")}',{
                'supplier_admin_id':id,'is_use':is_use
            },function (res) {
                layer.msg(res.msg);
            },'json')
        });
        $(".admin_thumb").click(function(){
            var that = this;
            amplificationImg(that);
        })

        function amplificationImg(that) {
            var url = $(that).attr("src");
            layer.open({
                type: 1,
                title: false,
                closeBtn: 0,
                shadeClose: true,
                area: ['400px', '400px'], //宽高
                content: "<img width='400px' height='400px' src=" + url + " />"
            });
        }

        $('.createSupplier').click(function () {
            var url = $(this).attr('href');
            layer.open({
                type:2,
                content:url,
                area:['80%','80%'],
                end:function () {
                    window.location.reload();
                }
            })
            return false;
        })

        $('.details').click(function () {
            var codeDetails = $(this).attr('data-content');
            var content = '<fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">\n' +
                '        <legend>供应商详情</legend>\n' +
                '    </fieldset>\n' +
                '\n' +
                '    <pre class="layui-code">\n' +formatJson(codeDetails) +
                '    </pre>';
            layer.open({
                type:1,
                content:content,
                area:['50%','80%']
            })
            return false;
        })

        var formatJson = function (json) {
            var outStr = '',     //转换后的json字符串
                padIdx = 0,         //换行后是否增减PADDING的标识
                space = '    ';   //4个空格符
            if (typeof json !== 'string') {
                json = JSON.stringify(json);
            }
            json = json.replace(/([\{\}\[\]])/g, '\r\n$1\r\n')
                .replace(/(\,)/g, '$1\r\n')
                .replace(/(\r\n\r\n)/g, '\r\n');
            (json.split('\r\n')).forEach(function (node, index) {
                var indent = 0,
                    padding = '';
                if (node.match(/[\{\[]/)){
                    indent = 1;
                }else if (node.match(/[\}\]]/)){
                    padIdx = padIdx !== 0 ? --padIdx : padIdx;
                }else{
                    indent = 0;
                }
                for (var i = 0; i < padIdx; i++){
                    padding += space;
                }
                outStr += padding + node + '\r\n';
                padIdx += indent;
            });
            return outStr;
        };
    });
</script>
</body>
</html>
